<template>
    <div class="pages">
         <nav-bar>
            <!-- 具名插槽 -->
            <template #left>
                <div class="lefts" @click="$emit('hidePop')">
                    <van-icon name="arrow-left"></van-icon>
                </div>
            </template>
            <template #center>
                <div>
                   商家详情
                </div>
            </template>
        </nav-bar>
         <div class="activelist">
            <div class="title">
                活动与属性
            </div>
            <div v-for="(item,index) in list" :key="index" class="active_item">
                <van-tag :color="'#'+item.icon_color">{{item.icon_name}}</van-tag>
                <span class="des">{{item.description}} 
                <span v-if="index==list.length-1">（APP专享）</span>
                </span>
            </div>
         </div>
    </div>
</template>
<script>
export default {
    data() {
        return {
            list:[],
            shopInfo:null
        }
    },
    created(){
        console.log(this.$store.state.shopInfo)
        this.shopInfo = this.$store.state.shopInfo;
        //  将商家属性与活动合并到同一个数组中
        this.list = [...this.shopInfo.activities,...this.shopInfo.supports]
        console.log(this.list)
    }
}
</script>
<style lang="less" scoped>
.pages{
    width: 100%;
    min-height: 100vh;
    background: #f1f1f1;
    padding-top: 45px;
    .activelist{
        width: 100%;
        background: #fff;
        padding: 10px;
        margin-top: 10px;
        .title{
            padding: 10px 5px;
            font-size: 17px;
            color:#333;
            border-bottom: 1px solid #f1f1f1;
        }
        .active_item{
            padding: 10px 5px;
            font-size: 13px;
            .des{
                margin-left: 10px;
                color:#666;
            }
        }
    }
}
</style>